<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>栅格系统</title>
	<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css">
</head>
<body>
	<table class="table table-bordered">
		<thead>
			<tr>
				<th> </th>
				<th>超小屏幕</th>
				<th>小屏幕</th>
				<th>中等屏幕</th>
				<th>大屏幕</th>
			</tr>
		</thead>
		<tbody>
			<tr>
				<td>栅格系统行为</td>
				<td>总是水平排列</td>
				<td colspan="3">开始是堆叠在一起，当大于这些阈值是将变成水平排列</td>
			</tr>
			<tr>
				<td><code>.container</code>最大宽度</td>
				<td>None(自动)</td>
				<td>750px</td>
				<td>970px</td>
				<td>1200px</td>
			</tr>
			<tr>
				<td>类前缀</td>
				<td><code>.col-xs-</code></td>
				<td><code>.col-sm-</code></td>
				<td><code>.col-md-</code></td>
				<td><code>.col-lg-</code></td>
			</tr>
			<tr>
				<td>列数column</td>
				<td colspan="4">12</td>
			</tr>
			<tr>
				<td>最大列宽column</td>
				<td>自动</td>
				<td>~62px</td>
				<td>~81px</td>
				<td>~97px</td>
			</tr>
			<tr>
				<td>槽宽gutter</td>
				<td colspan="4">30px(每列两侧都有15px)</td>
			</tr>
			<tr>
				<td>可嵌套</td>
				<td colspan="4">是</td>
			</tr>
			<tr>
				<td>偏移</td>
				<td colspan="4">是</td>
			</tr>
			<tr>
				<td>列排序</td>
				<td colspan="4">是</td>
			</tr>
		</tbody>
	</table>




	<script src="bootstrap-3.3.5-dist/jquery/jquery.min.js"></script>
	<script src="bootstrap-3.3.5-dist/bootstrap/bootstrap.min.js"></script>
</body>
</html>